﻿@model Mangdot.Webchat.Models.TemplateModel[]
@{
    ViewBag.Title = "模板";
}

<div class="right_col" role="main" id="vue_data">
    <div class="row" style="margin-right:-5px !important;">
        <button type="button" class="btn btn-success pull-right">发布</button>
        <button type="button" class="btn btn-danger pull-right" v-on:click="create">新建</button>
    </div>
    <table id="datatable" class="table table-striped table-bordered">
        <thead>
            <tr>
                <th>编号</th>
                <th>分类</th>
                <th>模板名称</th>
                <th>创建时间</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var item in Model)
            {
                <tr>
                    <td>@item.Id</td>
                    <td>@item.Category</td>
                    <td>@item.Name</td>
                    <td>@item.CreateTime</td>
                    <td>
                        <button type="button" class="btn btn-info btn-xs" onclick="Edit('@item.Id')">编辑</button>
                        <button type="button" class="btn btn-success btn-xs" onclick="SingnalPublish('@item.Id')">发布</button>
                    </td>
                </tr>
            }
        </tbody>
    </table>

    <div class="modal fade templateModel" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel">模板处理</h4>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label>所属分类</label>
                        <select class="form-control" v-model="Template.CategoryId">
                            <option value="-1">请选择</option>
                            <option v-for="item in CategoryList" v-bind:value="item.Id">{{item.Name}}</option>
                        </select>
                    </div>

                    <div class="form-group">
                        <label>名称</label>
                        <input type="text" class="form-control" v-model="Template.Name" />
                    </div>

                    <div class="form-group">
                        <label>模板</label>
                        <textarea class="form-control" rows="10" v-model="Template.Content"></textarea>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" v-on:click="save">保存</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade tipModel" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-sm">
            <div class="modal-content  alert alert-danger text-center">
                <h4>发布成功！</h4>
            </div>
        </div>
    </div>

</div>

@section scripts{
    <script>
        var templateModel = {
            Id: 0,
            CategoryId: -1,
            Name: "",
            Content: ""
        };


        $(function () {

            $.post('/admin/getcategory', {}, function (rep) {
                var vm = new Vue({
                    el: "#vue_data",
                    data: {
                        CategoryList: rep,
                        Template: templateModel
                    },
                    methods: {
                        save: function (e) {
                            Save(this.Template);
                        },
                        create: function (e) {
                            templateModel.Id = 0;
                            templateModel.CategoryId = -1;
                            templateModel.Name = "";
                            templateModel.Content = "";
                            openModel()
                        }
                    }
                });
            });


        })

        function Edit(id) {

            $.post('/admin/gettemplate', { id: id }, function (rep) {
                templateModel.Id = id;
                templateModel.CategoryId = rep.CategoryId;
                templateModel.Name = rep.Name;
                templateModel.Content = rep.Content;
            })
            openModel();
        }

        function Save(obj) {
            $.post('/admin/savetemplate', templateModel, function (rep) {
                if (rep) {
                    closeModel();
                    showTip('保存成功！');
                    window.history.go(0);
                } else {
                    showTip('保存失败！')
                }
            })
        }

        function openModel() {
            $(".templateModel").modal('show');
        }

        function closeModel() {

            $(".templateModel").modal('hide');
        }

        function showTip(msg) {
            $(".tipModel h4").html(msg);
            $(".tipModel").modal('show');
            setTimeout(function () { $(".tipModel").modal('hide'); }, 2000);
        }

        function SingnalPublish(id) {
            $.post('/admin/GeneralSite', { id: id }, function (rep) {
                if (rep) {
                    showTip('发布成功');
                } else {
                    showTip('发布失败');
                }
            })
        }
    </script>
}